<template>
  <ul class="booklist">
    <li v-for="book in bookList" :key="book.id">
      <img :src="'http://115.227.16.200:8003' + book.pictureUrl" alt="" />
    </li>
  </ul>
</template>
<script>
export default {
  props: ["bookList"],
};
</script>
<style lang="less" scoped>
.booklist {
  display: flex;
  align-items: center;
  height: 1.2rem;
  width: 3.5rem;
  overflow-x: auto;
  &::-webkit-scrollbar {
    width: 0px;
  }
  li {
    width: 0.77rem;
    height: 100%;
    flex-shrink: 0;
    margin-right: 0.08rem;
    &:last-child {
      margin-right: 0;
    }
    > img {
      display: block;
      width: 100%;
    }
  }
}
</style>
